//动态商品
$(function () {

	console.log("hello");
	refreshGoodsMenuList();

});




/** banner **/
let banner = document.getElementById("banner");
let circleList = document.getElementById("circle-list");
let lis = banner.children[0].children;
let cirLis = circleList.children[0].children;
let bannerLeft = document.getElementById("banner-left");
let bannerRight = document.getElementById("banner-right");
//设置圆点总的宽度
let cirLisWidth = (cirLis.length)*11+14;
circleList.style.width = cirLisWidth+"px";
//设置圆点的个数
let index = 0;
//轮播图自动轮播
let run;
autoRun();


function autoRun (){
	run = setInterval(function(){
			lis[index].removeAttribute("class");
			cirLis[index].removeAttribute("class");
			index++;
			if(index == lis.length){
				index = 0;
			}
			lis[index].setAttribute("class","active");
			cirLis[index].setAttribute("class","active-circle");
		},2000)	
}
//鼠标移入banner
banner.onmouseenter = function(){
	clearInterval(run);
}
banner.onmouseleave = function(){
	autoRun();
}
//鼠标移入圆点
for(let i=0; i<cirLis.length; i++){
	cirLis[i].onmouseover = (function(i){
		return function(){
			lis[index].removeAttribute("class");
			cirLis[index].removeAttribute("class");
			index = i;
			lis[i].setAttribute("class","active");
			cirLis[i].setAttribute("class","active-circle");
		}
	})(i)
}
//向左点击
bannerLeft.onclick = function(){
	lis[index].removeAttribute("class");
	cirLis[index].removeAttribute("class");
	index--;
	if(index < 0){
		index = lis.length-1;
	}
	lis[index].setAttribute("class","active");
	cirLis[index].setAttribute("class","active-circle");
}
//向右点击
bannerRight.onclick = function(){
	lis[index].removeAttribute("class");
	cirLis[index].removeAttribute("class");
	index++;
	if(index == lis.length){
		index = 0;
	}
	lis[index].setAttribute("class","active");
	cirLis[index].setAttribute("class","active-circle");
}
/** 图书 **/
let tushu = document.getElementById("tushu");
let tushucircleList = document.getElementById("tushuCircle-list");
let tushulis = tushu.children[0].children;
let tushucirLis = tushucircleList.children[0].children;
let tushuLeft = document.getElementById("tushu1Left"); 
let tushuRight = document.getElementById("tushu1Right");
//设置圆点总的宽度
let tushucirLisWidth = (tushucirLis.length)*11+14;
tushucircleList.style.width = tushucirLisWidth+"px";
//设置圆点的个数
let index1 = 0;
//自动轮播
let run1;
autoRun1();
function autoRun1 (){		
	run1 = setInterval(function(){
			tushulis[index1].removeAttribute("class");
			tushucirLis[index1].removeAttribute("class");
			index1++;
			if(index1 == tushulis.length){
				index1 = 0;
			}
			tushulis[index1].setAttribute("class","active");
			tushucirLis[index1].setAttribute("class","active-circle");
		},2000)	
}
//鼠标移入图书
tushu.onmouseenter = function(){
	clearInterval(run1);
}
tushu.onmouseleave = function(){
	autoRun1();
}
//鼠标移入圆点
for(let i=0; i<tushucirLis.length; i++){
	tushucirLis[i].onmouseover = (function(i){
		return function(){
			tushulis[index1].removeAttribute("class");
			tushucirLis[index1].removeAttribute("class");
			index1 = i;
			tushulis[i].setAttribute("class","active");
			tushucirLis[i].setAttribute("class","active-circle");
		}
	})(i)
}
//向左点击
tushuLeft.onclick = function(){
	tushulis[index1].removeAttribute("class");
	tushucirLis[index1].removeAttribute("class");
	index1--;
	if(index1 < 0){
		index1 = tushulis.length-1;
	}
	tushulis[index1].setAttribute("class","active");
	tushucirLis[index1].setAttribute("class","active-circle");
}
//向右点击
tushuRight.onclick = function(){
	tushulis[index1].removeAttribute("class");
	tushucirLis[index1].removeAttribute("class");
	index1++;
	if(index1 == tushulis.length){
		index1 = 0;
	}
	tushulis[index1].setAttribute("class","active");
	tushucirLis[index1].setAttribute("class","active-circle");
}
/** 倒计时 **/
function countTime() {  
    //获取当前时间  
    let date = new Date();  
    let now = date.getTime();  
    //设置截止时间  
    let str="2018/12/20 00:00:00";
    let endDate = new Date(str);      
    let end = endDate.getTime();  
    
    //时间差  
    let leftTime = end-now; 
    //定义变量 h,m,s保存倒计时的时间  
    let h,m,s;  
    if (leftTime>=0) {  
        h = Math.floor(leftTime/1000/60/60%24);  
        m = Math.floor(leftTime/1000/60%60);  
        s = Math.floor(leftTime/1000%60);                     
    }  
	(h<10) ? h = "0"+h : h;
    (m<10) ? m = "0"+m : m;
    (s<10) ? s = "0"+s : s;
    //将倒计时赋值到div中  
    //document.getElementById("_d").innerHTML = d+"天";  
    document.getElementById("_h").innerHTML = h;  
    document.getElementById("_m").innerHTML = m;  
    document.getElementById("_s").innerHTML = s;  
    //递归每秒调用countTime方法，显示动态时间效果  
    setTimeout(countTime,1000);  
}
countTime();  
/** 闪购 **/
let shangou = document.getElementById("shangou");//闪购div
let shangouCon = document.querySelector(".flashover_item_con_div");	//获取要移动的div
let goodlist = document.getElementsByClassName("flashover_goodlist");//单个商品div
let gLen = goodlist.length;//商品个数
let showW = parseInt((234+14)*4);	//div显示宽度
let divW = parseInt((234+14)*gLen); //div总宽度
let runL,runR;
function flashover(val){
	switch (val) {
		case "R":
			clearInterval(runL);
			autoR();
			setTimeout("clearInterval(runR)",200);
		break;
		case "L":
			clearInterval(runR);
			autoL();
			setTimeout("clearInterval(runL)",200);
		break;
	}
}
function autoL(){
	let boxLeft = shangouCon.style.left;		
	let boxLeftNum = parseInt(boxLeft.substr(0,boxLeft.length-2));	//获取距离左侧距离
	let a = boxLeftNum;
	runL = setInterval(function(){
		if(a > -992 && a<=0 ){			
			a=a-248;
			shangouCon.style.left =  a+"px"; //每点击一次，向右移动50px
			console.log(a);
		}
	},50);
}
function autoR(){
	let boxLeft = shangouCon.style.left;		
	let boxLeftNum = parseInt(boxLeft.substr(0,boxLeft.length-2));	//获取距离左侧距离
	let a = boxLeftNum;
	runR = setInterval(function(){
		if(a >= -992 && a<0 ){			
			a=a+248;
			shangouCon.style.left = a+"px"; //每点击一次，向右移动50px
			console.log(a);
		}
	},50);
}
/** tab **/
let houseElectricalTitle = document.getElementById("houseElectricalTitle").getElementsByTagName("li");
let houseElectricalDiv = document.getElementById("houseElectricalDiv").getElementsByClassName("wiring_right_con");
let tabLen = houseElectricalTitle.length;
for(let i=0; i<tabLen; i++) {
	houseElectricalTitle[i].index = i;
	houseElectricalTitle[i].onmouseover = function(){
		let num = parseInt(this.index);
		for(let j=0; j<tabLen; j++) {
			houseElectricalTitle[j].className = "";
			houseElectricalDiv[j].className = "wiring_right_con hide";
		}
		houseElectricalTitle[num].className = "active";
		houseElectricalDiv[num].className = "wiring_right_con show";
	}
}





function refreshGoodsMenuList() {
	//发起ajax http请求获取到手机商品菜单列表数据
	httpGet("/phoneListServlet",showPhoneMenuList);

	function showPhoneMenuList(phoneList) {
		//业务内容清空
		$("#menu_list_phone").html("");

		let phoneListHtml = "";
		//获取模板
		let phoneTemplate = $("#template_goodsMenu_list").html();
		phoneList.forEach(phone=>{
			//替换模板标签内容
			let phoneHtml = phoneTemplate
				.replaceAll("{{goodsUrl}}", phone.goodsUrl)
				.replaceAll("{{phoneName}}", phone.phoneName);
			//拼接HTML
			phoneListHtml += phoneHtml;
		});
		//填充html到指定位置
		$("#menu_list_phone").html(phoneListHtml);
	}


	//发起ajax http请求获取到商品菜单列表数据
	httpGet("/goodsListServlet",showGroceriesMenuList);

	function showGroceriesMenuList(groceriesList) {
		//业务内容清空
		$("#menu_list_goods").html("");

		let groceriesListHtml = "";
		//获取模板
		let groceriesTemplate = $("#template_goodsMenu_list").html();
		groceriesList.forEach(groceries=>{
			//替换模板标签内容
			let groceriesHtml = groceriesTemplate
				.replaceAll("{{goodsUrl}}", groceries.goodsUrl)
				.replaceAll("{{phoneName}}", groceries.phoneName);
			//拼接HTML
			groceriesListHtml += groceriesHtml;
		});
		//填充html到指定位置
		$("#menu_list_goods").html(groceriesListHtml);
	}




	//发起ajax http请求获取到智能菜单列表数据
	httpGet("/intelligenceListServlet",showIntelligenceMenuList);

	function showIntelligenceMenuList(intelligenceList) {
		//业务内容清空
		$("#menu_list_intelligence").html("");

		let intelligenceListHtml = "";
		//获取模板
		let intelligenceTemplate = $("#template_goodsMenu_list").html();
		intelligenceList.forEach(intelligence=>{
			//替换模板标签内容
			let intelligenceHtml = intelligenceTemplate
				.replaceAll("{{goodsUrl}}", intelligence.goodsUrl)
				.replaceAll("{{phoneName}}", intelligence.goodsName);
			//拼接HTML
			intelligenceListHtml += intelligenceHtml;
		});
		//填充html到指定位置
		$("#menu_list_intelligence").html(intelligenceListHtml);
	}

	//发起ajax http请求获取闪购数据
	httpGet("/phoneListServlet",showShangouList);

	function showShangouList(phoneList) {
		//业务内容清空
		$("#shangouCon").html("");

		let phoneListHtml = "";
		//获取模板
		let phoneTemplate = $("#template_flashover_list").html();
		phoneList.forEach(phone=>{
			//替换模板标签内容
			let phoneHtml = phoneTemplate
				.replaceAll("{{goodsUrl}}", phone.goodsUrl)
				.replaceAll("{{phoneName}}", phone.phoneName)
				.replaceAll("{{price}}", phone.goodsPrice);
			//拼接HTML
			phoneListHtml += phoneHtml;
		});

		//填充html到指定位置
		$("#shangouCon").html(phoneListHtml);
	}

	//发起ajax http请求获取手机页数据
	httpGet("/phoneListServlet",showPhoneList);

	function showPhoneList(phoneList) {
		//业务内容清空
		$("#list_phone").html("");

		let phoneListHtml = "";
		//获取模板
		let phoneTemplate = $("#template_phone_list").html();

		for (let i = 0; i < 8; i++) {
			let phoneHtml = phoneTemplate
				.replaceAll("{{goodsUrl}}", phoneList[i].goodsUrl)
				.replaceAll("{{phoneName}}", phoneList[i].phoneName)
				.replaceAll("{{price}}", phoneList[i].goodsPrice);
			//拼接HTML
			phoneListHtml += phoneHtml;
		}

		//填充html到指定位置
		$("#list_phone").html(phoneListHtml);
	}

	//发起ajax http请求获取到杂货列表数据
	httpGet("/goodsListServlet",showGroceriesList);

	function showGroceriesList(groceriesList) {
		//业务内容清空
		$("#list_groceries").html("");
		$("#list_groceries2").html("");
		$("#list_groceries3").html("");
		$("#list_groceries4").html("");

		let groceriesListHtml = "";
		//获取模板
		let groceriesTemplate = $("#template_groceries_list").html();

		for (let i = 0; i < 8; i++) {
			let groceriesHtml = groceriesTemplate
				.replaceAll("{{goodsUrl}}", groceriesList[i].goodsUrl)
				.replaceAll("{{phoneName}}", groceriesList[i].phoneName)
				.replaceAll("{{goodsName}}", groceriesList[i].goodsName)
				.replaceAll("{{id}}", groceriesList[i].id)
				.replaceAll("{{price}}", groceriesList[i].goodsPrice);
			//拼接HTML
			groceriesListHtml += groceriesHtml;
		}


		//填充html到指定位置
		$("#list_groceries").html(groceriesListHtml);

		groceriesListHtml = "";
		//获取模板
		groceriesTemplate = $("#template_groceries_list").html();

		for (let i = 8; i < 16; i++) {
			let groceriesHtml = groceriesTemplate
				.replaceAll("{{goodsUrl}}", groceriesList[i].goodsUrl)
				.replaceAll("{{phoneName}}", groceriesList[i].phoneName)
				.replaceAll("{{id}}", groceriesList[i].id)
				.replaceAll("{{goodsName}}", groceriesList[i].goodsName)
				.replaceAll("{{price}}", groceriesList[i].goodsPrice);
			//拼接HTML
			groceriesListHtml += groceriesHtml;
		}
		$("#list_groceries2").html(groceriesListHtml);

		groceriesListHtml = "";
		//获取模板
		groceriesTemplate = $("#template_groceries_list").html();

		for (let i = 16; i < 24; i++) {
			let groceriesHtml = groceriesTemplate
				.replaceAll("{{goodsUrl}}", groceriesList[i].goodsUrl)
				.replaceAll("{{phoneName}}", groceriesList[i].phoneName)
				.replaceAll("{{id}}", groceriesList[i].id)
				.replaceAll("{{goodsName}}", groceriesList[i].goodsName)
				.replaceAll("{{price}}", groceriesList[i].goodsPrice);
			//拼接HTML
			groceriesListHtml += groceriesHtml;
		}
		$("#list_groceries3").html(groceriesListHtml);

		groceriesListHtml = "";
		//获取模板
		groceriesTemplate = $("#template_groceries_list").html();

		for (let i = 24; i < 32; i++) {
			let groceriesHtml = groceriesTemplate
				.replaceAll("{{goodsUrl}}", groceriesList[i].goodsUrl)
				.replaceAll("{{phoneName}}", groceriesList[i].phoneName)
				.replaceAll("{{id}}", groceriesList[i].id)
				.replaceAll("{{goodsName}}", groceriesList[i].goodsName)
				.replaceAll("{{price}}", groceriesList[i].goodsPrice);
			//拼接HTML
			groceriesListHtml += groceriesHtml;
		}

		$("#list_groceries4").html(groceriesListHtml);
	}





	//发起ajax http请求获取到商品列表数据
	httpGet("/intelligenceListServlet",showIntelligenceList);

	function showIntelligenceList(intelligenceList) {
		//业务内容清空
		$("#list_intelligence").html("");

		let intelligenceListHtml = "";
		//获取模板
		let intelligenceTemplate = $("#template_groceries_list").html();


		for (let i = 0; i < 8; i++) {
			let intelligenceHtml = intelligenceTemplate
				.replaceAll("{{goodsUrl}}", intelligenceList[i].goodsUrl)
				.replaceAll("{{phoneName}}", intelligenceList[i].goodsName)
				.replaceAll("{{goodsName}}", intelligenceList[i].goodsName)
				.replaceAll("{{price}}", intelligenceList[i].goodsPrice);
			//拼接HTML
			intelligenceListHtml += intelligenceHtml;
		}

		//填充html到指定位置
		$("#list_intelligence").html(intelligenceListHtml);
	}




}




//鼠标点击商品进入商品页
let goodsList = [];

function addIntoCart(obj) {

	let id = $(obj).siblings("label").attr("class");
	let goodsName = $(obj).siblings("p.good_desc").html();
	let price = $(obj).siblings("p.good_price").html().replace(/[^0-9]/ig,"");
	let url = $(obj).children().attr("src");


	let shop = {
		goodsId: id,
		imgUrl: url,
		remark: goodsName,
		price: price,
		goodsNum: 1,
		subtotal: price,
	};



	//商品信息存到数组里
	goodsList.push(shop);


	//goodsList.forEach(item=>console.log(item));
	let list = JSON.parse(sessionStorage.getItem("key"));

	//判断之前是否添加过商品到购物车
	if (list == null){
		sessionStorage.setItem("key",JSON.stringify(goodsList));
	} else {
		sessionStorage.setItem("key",JSON.stringify(list.concat(goodsList)));
	}

	goodsList = [];

	location.href = "details.html";



}

